<template>
  <view>
    <image src="../../static/images/logo.png" mode="" style="width: 280rpx; height: 280rpx; margin: 110rpx 235rpx; margin-bottom: 86rpx"></image>
    <button class="btn" open-type="getPhoneNumber" @getphonenumber="phonelogin">授权登录</button>
    <view class="xieyi">
      <radio value="r1" :checked="checked" @click="checked = !checked" style="transform: scale(0.7)" color="#3376f7" />
      我已阅读并同意
      <text style="color: #3376f7" @click="goxiyi('user')">《用户协议》</text>
      和
      <text style="color: #3376f7" @click="goxiyi('princy')">《隐私政策》</text>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      checked: false, // 阅读协议
      userid: ''
    };
  },

  methods: {
    //手机号授权登录

    phonelogin(e) {
      if (!this.checked) {
        return uni.showToast({
          title: '请先阅读用户协议和隐私协议',
          icon: 'none'
        });
      }
      console.log('手机号code', e.detail.code);
      uni.login({
        success: (res) => {
          console.log('login的code', res.code);
          this.http(
            '/user/weChatMiniLogin',
            {
              code: res.code,
              mobile_code: e.detail.code,
              user_id: uni.getStorageSync('userid') || '',
              type: uni.getStorageSync('type').substring(0, 1) || ''
            },
            'POST'
          ).then((res) => {
            console.log(res.data);
            uni.setStorageSync('user', res.data);
            uni.setStorageSync('token', res.data.token);
            uni.reLaunch({
              url: '/pages/index/index'
            });
          });
        }
      });
    },
    // 跳转到隐私协议
    goxiyi(type) {
      if (type == 'user') {
        uni.navigateTo({
          url: '/mine/userxieyi/userxieyi'
        });
      } else if (type == 'princy') {
        uni.navigateTo({
          url: '/mine/privacy/privacy'
        });
      }
    }
  }
};
</script>

<style lang="scss">
.btn {
  width: 654rpx;
  height: 92rpx;
  text-align: center;
  line-height: 92rpx;
  background: #3483f6;
  font-weight: 500;
  font-size: 30rpx;
  color: #ffffff;
  border-radius: 20rpx 20rpx 20rpx 20rpx;
  margin: 0 48rpx;
}
.xieyi {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 24rpx;
  color: #222222;
  margin-top: 20rpx;
}
</style>
